<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>for循环 </title>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
  <div id="app">
      <input type="number" v-model.number="num">
      <!--.number如果想自动将用户的输入值转为数值类型，可以给 v-model 添加 number 修饰符：  v-model.number理解-->
      <!--type="number"   input类型是number类型-->
          <table border="1">
              <tr v-for="i in num">  <!--这个是循环外层   列   i in num 表示循环九行-->
                  <td v-for="j in i">{{j}}*{{i}}={{j*i}}</td>  <!--这个是循环行   j in i  这个表示每一列有几个  -->
              </tr>

          </table>


  </div>

<script>
    var app =new Vue({
      el:"#app",
        data:{
            num: 9,
        }
    });

</script>
</body>
</html>